﻿<!DOCTYPE html>
<html>
  <head>
    <title>Bootstrap 101 Template</title>
    <!-- Bootstrap -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/bootstrap-select.css" rel="stylesheet">
	<style type="text/css">
		#container {
			margin-top: 60px;
			margin-bottom: 20px;
		}
		.destroy {
			cursor: pointer;
			width: 20px;
			height: 20px;
			background: url(img/destroy.png) no-repeat;
		}
		.destroy:hover {
			background-position: 0 -20px;
		}
    </style>
	<!--<link href="css/bootstrap-responsive.css" rel="stylesheet">-->
  </head>
  <body>
        <div class="navbar navbar-inverse navbar-fixed-top">
		  <div class="navbar-inner">
			<div class="container">
			  <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
			  </a>
			 <a class="brand" href="index.html">Шарашкина контора</a>
			  <div class="nav-collapse collapse">
				<ul class="nav">
				  <li><a href="index.html">Товары</a></li>
				  <li class="active"><a href="basket.html">Корзина</a></li>
				  <li><a href="orders.html" id="ordersMenu">Заказы</a></li>
				</ul>
			  </div><!--/.nav-collapse -->
			</div>
		  </div>
		</div>
		
		<div class="container" id="container">
		
		<table class="table table-bordered table-striped table-hover table-condensed">
		  <thead>
			  <tr>
				<th>Картинка</th>
				<th>Продукт</th>
				<th>Количество</th>
				<th></th>
			  </tr>
			</thead>
			<tbody id="basket-items-list">
				<tr>
					<td colspan="2"></td>
					<td colspan="3">
						<select id="status" class="selectpicker span3">
						</select>
					</td>
				</tr>
			</tbody>
		  </table>
		  
		  <div class="row">
			<div class="span6">
            <a href="index.html" class="btn btn-primary">Вернуться к товарам</a>
			</div>		  		  
			<div class="span6">
			<a id="makeOrder" href="#myModal" role="button" class="btn btn-primary pull-right" data-toggle="modal">Оформить заказ</a>
			</div>
          </div>

      <hr>

		<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
				<strong id="myModalLabel">Оформить заказ</strong>
			</div>
			<div class="modal-body">
			</div>
			<div class="modal-footer">
				<button class="btn btn-primary" id="placeOrder">Заказать</button>
				<button class="btn" data-dismiss="modal" aria-hidden="true">Отмена</button>
			</div>
		</div>

		<footer>
			<p>&copy; Группа 5512</p>
		</footer>

    </div>
		
    
	<script src="js/json2.js"></script>
	<script src="js/jquery.js"></script>
	<script src="js/jquery-ui.js"></script>
	<script src="js/underscore.js"></script>
	<script src="js/backbone.js"></script>
	<script src="js/backbone-localstorage.js"></script>
	<script src="js/bootstrap.js"></script>
	<script src="js/bootstrap-select.js"></script>
	<script src="js/basket.js"></script>
	
	<script type="text/template" id="order-template">
		<table class="table table-bordered table-striped table-condensed">
			<tbody id="modal-content">
			<% for(var i=0; i<items.length; i++) {%>
				<tr>
					<td width="30%"><%= items[i].id %></td>
					<td width="50%"><%= items[i].name %></td>
					<td width="20%"><%= items[i].qty %></td>
				</tr>
			<% } %>
			</tbody>
		</table>
		<p><strong><%= (status==1)?'Высокий':'Обычный' %></strong> приоритет</p>
	</script>
	
	<script type="text/template" id="opts-template">
			<option value="0" <%= (status=='0')?'selected="selected"':'' %>>Обычный приоритет</option>
			<option value="1" <%= (status=='1')?'selected="selected"':'' %>>Высокий приоритет</option>
	</script>
	
	<script type="text/template" id="itog-template">
		<span class="pull-left">
			<strong><span class="muted">Итого:</span> <%= sum %> руб.</strong>
		</span>	
	</script>
	
	<script type="text/template" id="item-template">
				<td class="span2"><img width="50%" src="<%= img %>"></td>
				<td><%= name %></td>
				<td><input type="text" placeholder="1" class="input-mini" value="<%= qty %>"></td>
				<td class="span1"><div class="destroy"></div></td>
	</script>

  </body>
</html>